<!DOCTYPE HTML>
<html>
    <head>
        <title>Example</title>
        <meta name="author" content="Adam Freeman"/>
        <meta name="description" content="A simple example"/>
        <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
        <style type="text/css">
            div {
                width: 75%;
                height: 100px;
                border: thin solid black;
            }
            img {
                background: lightgray;
                border: 4px solid black;
                margin: 2px;
                height: 50%;
            }
            #first {
                box-sizing: border-box;
                width: 50%;
            }
            #second {
                box-sizing: content-box;
            }
        </style>
    </head>
    <body>
        <div>
            <img id="first" src="banana-small.png" alt="small banana">
            <img id="second" src="banana-small.png" alt="small banana">
        </div>
    </body>
</html>
